<template>
    <div class="main">
        <div class="guess-list">
            <Listitem class="align-center guess-item" :showtype="0">
                <template slot="left">
                    <img class="icon" src="@/assets/yl_img2.png" />
                </template>
                <template slot="center">
                    <div class="ml-24">
                        <div class="ft-32 ">
                            <span class="ft-b">时时猜</span>
                            <span class="ft-24 guess-num c-95">第20180528091期</span>
                        </div>
                        <div class="ft-28 guess-price c-5D">
                            <span>开奖结果 2 5 4 6 3 1</span>
                        </div>
                    </div>
                </template>
            </Listitem>
        </div>
    </div>
</template>
<script>
    import Tabs from '@/components/tabs';
    import TabPane from '@/components/tabPane';
    import Listitem from "@/components/list-item2";
    export default {
        components: {
            Tabs,
            TabPane,
            Listitem
        }
    }
</script>
<style scoped>
    .main .icon {
        width: 96px;
        height: 96px;
    }
    .c-5D{
        color:#5D5174;
    }
    .c-95{
        color:#958DA5;
    }
    .guess-list {
        padding-left: 40px;
    }

    .guess-item {
        overflow: hidden;
    }

    .guess-num {
        margin-left: 16px;
    }

    .guess-price {
        margin-top: 6px;
    }

    .guess-success:after {
        position: absolute;
        right: -46px;
        bottom: -84px;
        content: " ";
        width: 0;
        height: 0;
        border-left: 44px solid #FF9F03;
        border-top: 44px solid transparent;
        border-bottom: 44px solid transparent;
        transform: rotateZ(45deg);
    }

    .zhui-hao {
        position: absolute;
        right: -36px;
        bottom: -50px;
        font-size: 20px;
        transform: scale(0.8);
        z-index: 1;
        color: #FFF;
    }
</style>